<template>
<div >
  <el-container>
    <el-aside width="30%">
      <el-row>
        <div style="text-align: center">食品保质期轮播图</div>
        <lunbo></lunbo>
      </el-row>
      <el-row>
        <div style="text-align: center;margin: 1em">上架时间最长图</div>
        <jiaonang></jiaonang>
      </el-row>
    </el-aside>
    <el-aside width="40%">
      <el-row style="height: 45%">
        <you class="you"></you>
      </el-row>
      <el-row style="margin-left: 4em" >
        <div>食品距离过期所剩天数</div>
          <expRank></expRank>
      </el-row>
    </el-aside>
    <el-aside width="30%" >
      <el-row style="height:50%">
        <div>仓库中食品未过期比例</div>
        <water></water>
      </el-row>
      <el-row>
        <div>仓库中食品未过期比例</div>
        <pie></pie>
      </el-row>
    </el-aside>

  </el-container>

</div>
</template>

<script>
  import lunbo from "pages/components/bigData/lunbo";
  import jiaonang from "pages/components/bigData/jiaonang";
  import number from "pages/components/bigData/number";
  import you from "pages/components/bigData/you";
  import expRank from "pages/components/bigData/expRank";
  import water from "pages/components/bigData/water";
  import pie from "pages/components/bigData/pie";
    export default {
        name: "BigData",
        components:{
          lunbo,
          jiaonang,
          number,
          you,
          expRank,
          water,
          pie
        }

    }
</script>

<style scoped>
</style>
